<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>重新加载取消异常监听方法的方法</title>
</head>
<body>
<img src="https://www.baidu.cmo/img.png" onerror="errorHandler(this,this.src,3)" alt="百度不存在图片">
<script>
    const zhanPath = 'https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png'
    function errorHandler(Ele,src,maxRetryCount){
        if(maxRetryCount>0){
            console.log('加载失败，重试, 剩余重试次数',maxRetryCount)
            Ele.onerror= (e) => {
                errorHandler(Ele,src,maxRetryCount -1)
            }
            setTimeout(()=>{
                Ele.src  = src
            },1500)
        }else {
            console.log('重试次数为0，占位图片占位')
            Ele.onerror  = null
            Ele.src = zhanPath
        }
    }
</script>
</body>
</html>
